<template>
    <div class='input-audio-select'>
       <input-select v-if="isreadonly!='Y'" style="flex:1"  isAudio="Y" isChange="Y" @input="changeInput" ref="audioSelect" :fontSize="fontSize" :isEdit="isEdit" :id="id" :selectData="selectData"  :isreadonly="isreadonly" :dataField="dataField" :index="index"  :data="data" :isRequired="isRequired" :appid="appid" :exkey="exkey" :extype="extype"   :styles="styles"   :sign="sign" :time="time"  :postUrl="postUrl" :options="options"  :valsql="valsql" :valsql2="valsql2" :sign2="sign2" :time2="time2" ></input-select>
       <my-input v-else style="flex:1"  isAudio="Y" isChange="Y"  ref="audioSelect" :fontSize="fontSize" :isEdit="isEdit" :id="id" :selectData="selectData"  :isreadonly="isreadonly" :dataField="dataField" :index="index"  :data="data" :isRequired="isRequired" :appid="appid" :exkey="exkey" :extype="extype"   :styles="styles"   :sign="sign" :time="time"  :postUrl="postUrl" :options="options"  :valsql="valsql" :valsql2="valsql2" :sign2="sign2" :time2="time2" ></my-input>
      
       <el-button type="primary" size="mini" @click="getAudio" style="margin-left:5px;height:30px;" v-if="isreadonly!='Y'" >获取</el-button>              
       <el-button type="primary" size="mini" @click="playAudio" style="margin-left:5px;;height:30px;" v-if="isPlayAudio=='Y'">播放</el-button>           
    
       <el-dialog
            width="350px"
            title="播放音频"
            :visible.sync="showAudio"
            append-to-body>
            <audio 
                v-if="showAudio"
                ref="audio" 
                class="aud"
                autoplay 
                controls 
                loop 
                
                >
                <source :src="audioSrc" />
            </audio>

        </el-dialog>
    </div>
</template>
<script>

import InputSelect  from './input-select.vue'
import MyInput  from './myInput.vue'
export default {
    props:['id','options','styles','value','data','selectData','index','isreadonly','isBorder','extype','valsql','appid','dataField','isSearch','isChange','exkey','sign','time','sign2','time2','postUrl','isEdit','valsql2','fontSize','isRequired'],
        
    components: {
        InputSelect,
        MyInput
    },
    data(){
        return{
           isPlayAudio:"N",
           showAudio:false,
           audioSrc:""
        }
    },
    created(){
       
        window.setWebViewUploadAudio = this.setUploadAudio

        let setField=this.exkey.audio.setField;
        let audioField=setField.audio.split(".");
       
        if(this.data[audioField[0]][audioField[1]]){
            this.isPlayAudio="Y"
            this.audioSrc=this.data[audioField[0]][audioField[1]];
        }
    },
    methods:{
        getAudio(){
        this.$refs.audioSelect.getAudio();
      },
      changeInput(data){
        let datas=JSON.parse(data);
        let val=datas.val;
        let token=sessionStorage.getItem("token");

        let mobile = /(1[0-9]{10})|([0-9]{3,4})?[0-9]{7,8}/g; //匹配手机号或固话
        let num = val.replace(/\s|[(]|[)]|[（]|[）]|[-]*/g, ''); //去除字符串中所有空格、小括号和横杠
        const phone = num.match(mobile); //识别手机号或者固话
        let phone_="";
        for(let i=0;i<phone.length;i++){
            if(phone[i].indexOf("202")==-1){
                phone_=phone[i];
                break;
            }
        }
        this.$confirm('确定选择手机号：'+phone_+'?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
            let setField=this.exkey.audio.setField;
            let audioField=setField.tel.split(".");
        
            this.data[audioField[0]][audioField[1]]=phone_;
            this.myUni.webView.postMessage({  
                data: {  
                    action: "uploadAudio",
                    path:val,
                    url: this.exkey.audio.url,
                    token:token 
                },  
            });
        }).catch(() => {
                  
        });
       
      },
      setUploadAudio(data){
       
        let datas=JSON.parse(data.data)
        let url=datas[0].url;
        let setField=this.exkey.audio.setField;
        let audioField=setField.audio.split(".");
       
        this.data[audioField[0]][audioField[1]]=url;
        if(url){
            this.isPlayAudio="Y"
            this.$message({
            message: '获取录音文件成功！',
            type: 'success'
            });
        }

      },
      playAudio(){
        this.showAudio=true;
       
      }
    }
}
</script>
<style scoped>
    .input-audio-select{
        width:100%;
        display:flex;
        
        flex-direction: row;
    }
</style>